<template>
	<div>
		<div style="display: flex;flex-direction: row;width: 320px;margin: auto;margin-top: 10px;">
			<el-input placeholder="搜索" v-model="input" class="searchinput1">
				<i slot="prefix" class="el-input__icon el-icon-search" style="position: absolute; top: -7px;"></i>
			</el-input>
			<el-button type="primary" style="width: 70px;height: 25px; line-height: 20px;border-radius: 0px 20px 20px 0px;background-color: rgba(0, 128, 255, 100);text-align: center;box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.24);"
			class="button">
				<p style="font-size: 9px;text-align: center;font-family: Roboto;margin-top: -11px;margin-left: -10px;color: #ffffff;">
					搜索动态
				</p>
			</el-button>
		</div>
		<div class="box-card-dt">
			<div>
				<el-card :body-style="{ padding: '0px' }" class="dtcard">
					<img src="../assets/background.png" class="image">
					<div style="padding: 14px;">
						<span>好吃的汉堡</span>
						<div class="bottom clearfix">
							<time class="time">{{ currentDate }}</time>
						</div>
					</div>
				</el-card>
			</div>
		</div>
	</div>

</template>

<script>
	export default {
		data() {
			return {
			}
		},
		methods: {
			mounted() {
				this.requestUser()
			},
			requestUser() {
				var that = this
				this.$axios.post('http://localhost:8080/getbookbyid/' + this.input)
					.then(function(response) {
						console.log(response.data.data)
						alert("查询成功")
						that.tableData = response.data.data
					}).catch(function(error) {
						console.log(error)
	
					})
			}
		}
	}
</script>

<style>
	.searchinput input.el-input__inner {
		height: 25px;
		width: 250px;
		border-radius: 90px 0px 0px 90px;
		background-color: rgba(250, 250, 250, 100);
		text-align: center;
		border: 1px rgba(255, 0, 0, 0);
		font-size: 10px;
	}

	.box-card-dt{
		width: 20%;
		height: 100px;
		margin-top: 50px;
		margin-left: 50px;
		margin-bottom: 200px;
	}
</style>
